<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>商品详情</title>
<link href="static/bootstrap/css/bootstrap.css" rel="stylesheet" />
<link href="static/css/taobao.css" rel="stylesheet" />
<script src="static/jquery/jquery.js"></script>
<script src="static/bootstrap/js/bootstrap.js"></script>
<script src="static/js/checknum.js"></script>
</head>
<body>
	<!-- 横幅导航条开始 -->
	<jsp:include page="/WEB-INF/view/common/nva.jsp"></jsp:include>
	<!--  横幅下方的主体开始 -->
	<div class="container">

		<div class="row row-offcanvas row-offcanvas-right">

			<!-- 内容主体开始 -->
			<div class="col-xs-12 col-sm-12">
				<div class="col-xs-12 col-sm-6">
					<img style="width:300px;height:300px" alt="商品的图片" src="static/image/article/${article.image}">
				</div>
				<div class="col-xs-12 col-sm-6">
					<p>${article.title}</p>
					<p>${article.supplier}</p>
					<p>${article.locality}</p>
					<p>
						<span class="price">${article.price}</span>
                        <font color="red">折后价格：${article.price  * article.discount}</font>
					</p>
					<p>
						库存量：<span id="storage">${article.storage}</span>
					</p>
					<p>
					<form method="get" action="addToCar">
						<input type="hidden" name="id" value="${article.id}" /> <span
							style="font-weight: bold; font-size: 18px; cursor: pointer; margin-left: 10px; margin-right: 10px;"
							onclick="min()">-</span>
						<input id="number" onblur="blurFn(this)" name="number" value="1" style="width: 50px;" />
						<span
							style="font-weight: bold; font-size: 18px; cursor: pointer; margin-left: 10px; margin-right: 10px;"
							onclick="add()">+</span>
						<button>
							<span class="glyphicon glyphicon-shopping-cart"
								style="color: red;"></span>加入购物车
						</button>
					</form>
					</p>
				</div>
				<div class="col-xs-12">
					<fieldset>
						<legend>介绍</legend>

						${article.description}
					</fieldset>
				</div>
			</div>
			<!--/.col-xs-12.col-sm-9-->
			<!-- 内容主体结束 -->
		</div>
		<!--/row-->
		<hr>
		<footer>
			<p>&copy; 版权所有，欢迎借鉴</p>
		</footer>

	</div>
	<!--/.container-->
	<!--  横幅下方的主体结束 -->

</body>
</html>